<script setup>

import { watch, ref, onMounted } from "vue";
import {RouterLink} from "vue-router";

let content = ref("登录/注册");
const status = "isAuthenticated";
watch(localStorage.getItem(status), (newVal, oldVal) => {
    if (newVal === "true") {
        content.value = "个人中心";
    } else {
        content.value = "登录/注册";
    }
})

onMounted(()=>{
    if(localStorage.getItem(status) === "true"){
        content.value = "个人中心";
    }
})

</script>

<template>
    <RouterLink class="ainow-login" to="/space">
        {{ content }}
    </RouterLink>
</template>

<style scoped lang="less">
@import "@/assets/main.less";
.ainow-login {
    color: inherit;
    font-size: 1.4rem;
    font-weight: bold;
    height: 50px;
    display: flex;
    place-items: center;
    &:hover {
        background: transparent;
        color: @light-font-hover-color;
    }
    img{
        height: 50%;
        margin-right: 3px;
    }
}
</style>
